@model zhangmenren.Models.ViewModle.WorksModel

@if(Model!=null){
<div class="bg-gray">
	<header class="mui-bar mui-bar-nav head-bar-nav">
		<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" href="javascript:history.back(-1)"></a>
		<h1 class="mui-title">精品课程</h1>
        <a class="mui-icon mui-icon-more mui-pull-right" onclick="jsBridge.share()"></a>
	</header>
	<!--DOM -->
	<div class="mui-content bg-gray">


		@if (ViewBag.ISOK)
		{
		<div class="prism-player" id="J_prismPlayer"></div>
		}
		else
		{
		<div class="excellent-course-content-video">
			<img src="@Model.CoverImg" />
		</div>
		}

		<!---->
		<div class="mui-slider excellent-course-slider-box">
			<div class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted excellent-course-slider-tab">
				<a class="mui-control-item mui-active j-xiangqing" href="javascript:;">详情</a>
				<a class="mui-control-item j-zhangjie" href="javascript:;">章节</a>
			</div>
			<div class="mui-slider-group">
				<div id="item1" class="mui-slider-item mui-control-content mui-active">
					<ul class="mui-table-view excellent-course-list excellent-course-content-list">
						<li class="mui-table-view-cell mui-media">
							<a class="mui-navigate-right">
								<div class="mui-media-body" style="width:100%;">
									<h5 class="mui-ellipsis-2">@Model.Title</h5>
									<p>@(Model.Price > 0 ? "¥" + Model.Price.ToString("0.##") : "免费")</p>
									<p>@Model.GouMaiNum 人购买</p>
								</div>
							</a>
						</li>
					</ul>

					@if (string.IsNullOrEmpty(Model.Author))
					{
					<div class="chat-content bg-white excellentCourse-content">
						<div class="list-header">
							<a class="header-icon">
								概况
							</a>
						</div>
						<ul class="mui-table-view user-list">
							<li class="mui-table-view-cell mui-media user-header-box dx-header-box">
								<a class="mui-navigate-right">
									<div class="mui-clearfix">
										<div class="mui-media-object mui-pull-left">
											<img src="/images/user-header-img.png">
										</div>
										<div class="mui-media-body">
											<h5>@ViewBag.zuozhe.UserName</h5>
											<p>掌门号：@Model.AuthorId</p>
										</div>
									</div>
									<div class="user-info-content">
										<div class="user-info-item">
											<p>@ViewBag.zaisou</p>
											<p>在售课程</p>
										</div>
										<div class="user-info-item">
											<p>58</p>
											<p>免费课程</p>
										</div>
										<div class="user-info-item">
											<p>@Model.ShouChangNum</p>
											<p>收藏数量</p>
										</div>
									</div>
									<p class="user-text-qm">
										个性签名：@ViewBag.zuozhe.Signature
									</p>
								</a>
							</li>
						</ul>
					</div>
					}
					else
					{
					<div class="chat-content bg-white excellentCourse-content">
						<div class="list-header">
							<a class="header-icon">
								课程简介
							</a>
						</div>
						<span>@Model.Describe</span>
					</div>
					}



					<div class="chat-content bg-white" style="margin: 10px 0 0 0;padding:0 10px 10px;">
						<div class="list-header">
							<a class="header-icon" style="background-image: url(/images/header-icon-xkdetailicon.png);">
								评论
							</a>
						</div>
						<div style="width: 100%;margin:0px auto 10px;border-radius: 5px;background-color: rgb(255, 255, 255);box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.08);">
							@*<dl class="all-pl-group">
								<dt class="mui-clearfix">
									<div class="head">
										<img src="images/personalData-headImg.png" alt="">
									</div>
									<div class="mui-pull-left">
										<p>一克拉梦想ykt1</p>
										<p style="color: #b2b2b2;font-size: 12px;">10小时前</p>
										<p>请问这个软件我应该从哪里学起呢？</p>
									</div>
								</dt>

							</dl>*@

							@if (ViewBag.Comment != null && (ViewBag.Comment as List<zhangmenren.Models.CommentEntity>).Count > 0)
								{
								foreach (var item in ViewBag.Comment as List<zhangmenren.Models.CommentEntity>)
									{
									<dl class="all-pl-group">
										<dt class="mui-clearfix">
											<div class="head">
												<img src="@item.HeadImg">
											</div>
											<div class="mui-pull-left">
												<p>@item.UserName</p>
												<p style="color: #b2b2b2; font-size: 12px;">@string.Format("{0:yyyy-MM-dd}", item.AddDT)</p>
												<p>@item.Content</p>
											</div>
										</dt>

									</dl>
									}
									}
									else
									{
									<dl class="all-pl-group">
										<dt class="mui-clearfix">
											<span>暂无评论</span>
										</dt>

									</dl>
									}
						</div>
					</div>
				</div>
				<!--  -->
				<div id="item2" class="mui-slider-item mui-control-content" style="display: none;">
					<div class="course-list">
						<ul class="mui-table-view neironglist">
							@foreach (var item in ViewBag.Ca as List<zhangmenren.Models.ChapterEntity>)
								{
								<li class="mui-table-view-cell course-list-item" data-url="@item.Url">
									<a class="mui-navigate-right">
										@item.Title
									</a>
								</li>

								}
								@*<li class="mui-table-view-cell course-list-item">
									<a class="mui-navigate-right">
										2.工具介绍
									</a>
								</li>*@

						</ul>
					</div>
				</div>
			</div>
			<div class="buy-flex-box">
				<span class="cosult-btn">
					@*咨询*@
				</span>
				<a class="mui-btn mui-btn-yellow" href='@Url.Action("Index","Order",new{id=Model.Id })'>
					立即购买
				</a>
			</div>
		</div>
		<!---->

	</div>
</div>
}else{

<span>暂无内容</span>
}



@section Scripts{

<script>
	function endedHandle(url) {
		player.dispose(); //销毁
		$('#J_prismPlayer').empty(); //id为html里指定的播放器的容器id
		//重新创建
		player = new Aliplayer({
			id: "J_prismPlayer",
			width: '100%',
			autoplay: false,
			preload: false,
			source: url,
			cover: "@Model.CoverImg",

		});
	}




	$(".j-zhangjie").click(function() {
		$(this).addClass("mui-active");
		$(".j-xiangqing").removeClass("mui-active");
		$("#item2").show();
		$("#item1").hide();
	})
	$(".j-xiangqing").click(function() {
		$(this).addClass("mui-active");
		$(".j-zhangjie").removeClass("mui-active");
		$("#item1").show();
		$("#item2").hide();
	})

	$(".neironglist li").click(function() {
		endedHandle($(this).data("url"))
	})
        if ('@ViewBag.ISOK' == "True") {
		$('#J_prismPlayer').empty(); //id为html里指定的播放器的容器id
		//重新创建
		player = new Aliplayer({
			id: "J_prismPlayer",
			width: '100%',
			autoplay: false,
			preload: false,
			source: $(".neironglist li").eq(0).data("url"),
			cover: "@Model.CoverImg",

		});
        player.on("play", function() {
        if ('@ViewBag.ISOK' != "True") {
            player.pause();
            layerm.open({
                content: '请先购买',
                bth: '确定'
            });
        }
    })
    }

</script>
}
